{header}
<style type="text/css">
    .selected li{ width:110px; height:80px; float:left; display:inline; margin-right:20px; position:relative; margin-bottom: 20px; text-align: center; }
    li .close{ background:url(./images/close.gif) no-repeat; width:11px; height:11px; display:block; overflow:hidden; text-indent:-999em; position:absolute; right:5px; top:5px;cursor: pointer;  }
</style>
<script type="text/javascript" src="./js/jquery/ajaxfileupload.js"></script>
<table width="100%"  border="0" cellpadding="3" cellspacing="1" class="tableOutborder">
    <tr class="tableHeader">
      <td colspan="9">图片库</td>
    </tr>
    <tr class="bg_0">
      <td width="4%" nowrap="nowrap">文件名</td>
      <td width="4%" nowrap="nowrap"><input name="filename" type="text" id="filename" value="" size="20" maxlength="30" /></td>
      <td width="4%" nowrap="nowrap">添加时间</td>
      <td width="4%" nowrap="nowrap"><input name="add_time" type="text" id="add_time" value="" /></td>
      <td width="12%"><input name="action" type="hidden" id="action" value="view" />
          <input type="button" name="Submit" value=" 查询 " onclick="query_search()" accesskey="s" /></td>
      <td><span id="apk_input">
            <input id="ToUpload" type="file" name="ToUpload" />
            <input type="button" name="buttonUpload" id="buttonUpload" onclick="return ajaxFileUpload();" value="上传"/>
            <input name="uploadresult" type="hidden" id="uploadresult" readonly="readonly" />
        </span>
            名称:<input name="imgname" type="text" id="imgname" size="20" />
          分类:{selecttreelist}
          <input type="button" name="buttonaddimg" value=" 提交 " onclick="addimg()" />
      </td>
    </tr>
</table>
<table id="selectedtable" style="display: none;" width="100%"  border="0" cellpadding="3" cellspacing="1" class="tableOutborder">
    <tr class="tableHeader">
      <td colspan="9">已选图片</td>
    </tr>
    <tr class="bg_2">
      <td><ul id="allimgid" class="selected"></ul></td><td><input type="button" name="Submit" value=" 选定 " onclick="parentselect()"/></td>
    </tr>
    <tr class="bg_1">
      <td colspan="9"></td>
    </tr>
</table>
<table width="100%"  border="0" cellspacing="1" cellpadding="3" class="tableOutborder">
  <tr class="tableHeader">
    <td width="20%">分类</td>
    <td>图片列表</td>

  </tr>
      <tr>
        <td valign="top" id="treelist">{treelist}<script type="text/javascript">$(function(){
            $("#treelist ul li a").unbind().bind("click",function(){
                $("#treelist ul li a").attr("style","color:''");
                $(this).attr("style","color:blue");
            })
        })</script></td>
        <td>
            <table width="100%" border="0" cellspacing="1" cellpadding="3" class="pageNav">
                <tr id="pagetop">
                </tr>
            </table>
            <table id="imagedb" width="100%" border="0" cellspacing="1" cellpadding="3">
                <tr>
                    <td></td>
                    <td></td>
                </tr>
            </table>
            <table width="100%" border="0" cellspacing="1" cellpadding="3" class="pageNav">
                <tr id="pagebottom">
                </tr>
            </table>
        </td>
      </tr>
</table>
<script type="text/javascript">
    $(function(){
        $("body").unbind('keyup').keyup(function(event){
            if(event.keyCode == 13)  query_search();
        });
    })
    function query_search(){
        var filename=$("#filename").val();
        var add_time=$("#add_time").val();
        if(filename=="" && add_time==""){
            alert("请输入查询条件");
            if(filename=="")$("#filename").focus();
            if(add_time=="")$("#add_time").focus();
            return false;
        }
        list_imagedb('',filename,add_time);
    }
    function ajax_request_page(url){
        $.ajax({
            url:url,
            methods:"POST",
            dataType:"json",
            success:function(data){
                //console.log(data)
                if(data.result==0){
                    displayproducts(data);
                    showpage(data.page);
                }else{
                    $("#pagetop").html("");
                    $("#pagebottom").html("");
                    $("#imagedb").html("<tr><td>"+data.msg+"</td></tr>");
                }

            },
            error:function(){
                alert("<tr><td>啊哦,请求失败</td></tr>");
            },
            beforeSend:function(){
                $("#imagedb").html("<tr><td>正在努力获取图片列表......</td></tr>");
            }
        })
    }
    function list_imagedb(id,names,add_time){//显示分类下的图片信息
        var url=iyun_interface("imageDb")+"?folder="+id+"&names="+names+"&add_time="+add_time;
        ajax_request_page(url);
    }
    function displayproducts(products){
        //console.log(products);

        var list=products.msg;
        if(list.length==0){
            $("#imagedb").html("<tr><td>暂无改类图片</td></tr>");
        }else{
            var html='<ul class="selected">';
            var names;
            var img_url;
            var pos;
            var img_urlf;
            for(var i=0;i<list.length; i++){
                names=list[i].names;
                img_url=list[i].img_url;
                pos=img_url.lastIndexOf("\.");
                if(pos>-1){
                    img_urlf=img_url.substr(0,pos);
                    img_url=img_urlf+"_th."+img_url.substr(pos+1,5);
                }
                filenames=names.replace($("#filename").val(),'<span style="color: red;">'+$("#filename").val()+'</span>');

                html+='<li>' +
                        '<a href="javascript:void(0);" onclick="selectimg(this)" title="'+list[i].names+'">' +
                        '<img id="'+list[i].id+'" width="110" height="80" src="'+img_url+'" alt="'+list[i].names+'" /></a><a class="close" onclick="delimg(\''+list[i].id+'\',\''+list[i].folder+'\')"><img alt="" src="./images/close.gif"></a><br />' +
                        '<a href="javascript:;" title="'+list[i].names+'">'+filenames+'</a>' +
                        '</li>';
            }
            $("#imagedb").html(html+"</ul>");

        }

    }
    function showpage(page){
        $("#pagetop").html("");
        $("#pagebottom").html("");
        if(page!="undefined"){
            html='<td>共 <strong>'+page.total+'</strong>, 显示 <strong>'+page.from+' - '+page.to+'</strong></td><td align="right">'+page.pagenav+'</td>'
            $("#pagetop").html(html);
            $("#pagebottom").html(html);
        }
    }
    function selectimg(thiss){//选择图库
        var exsitflg=false;
        if($("#allimgid li").length>0){
            $("#allimgid li").each(function(){
                //console.log($(this).find("img").first().attr("id"));
                //console.log($(thiss).find("img").first().attr("id"));
                if($(this).find("img").first().attr("id")==$(thiss).find("img").first().attr("id")){
                    //alert("已经存在此图请不要重复操作");
                    exsitflg=true;
                    return false;
                }
            })
        }
        if(exsitflg)return false;
        var html=$("#allimgid").html();
        html+="<li>"+$(thiss).html()+"<a class='close' onclick='delselectedimg(this)'><img src='./images/close.gif'  alt=''>" +
                "</a><br>"+$(thiss).parent().find("a").last().html()+"</li>";
        $("#allimgid").html(html);
        if($("#allimgid li").length>0){
            $("#selectedtable").show();
        }

    }
    function delselectedimg(thiss){//删除选中的图片
        $(thiss).parent().remove();
        if($("#allimgid li").length<1){
            $("#selectedtable").hide();
        }
    }
    function ajaxFileUpload(){//上传
        var fileuploadid="ToUpload";
        $.ajaxFileUpload
                (
                        {
                            url:'/script/upload/doajaxfileupload_img.php',
                            secureuri:false,
                            fileElementId:fileuploadid,
                            dataType: 'json',
                            data:{ name:filename },
                            success: function (data, status)
                            {

                                if(typeof(data.error) != 'undefined')
                                {
                                    if(data.error != '')
                                    {
                                        alert(data.error);
                                    }else
                                    {
                                        $("#uploadresult").val(data.result);//保存返回的路径结果
                                        alert(data.msg);
                                    }
                                }

                            },
                            error: function (data, status, e)
                            {
                                alert(e);
                            }
                        }
                );
        return false;
    }
    function delimg(id,cate){
        if(confirm("你确定删除该图片了\r\n该操作不可恢复！")){
            var url=iyun_interface("imageDb")+"?do=delimgdb";
            if(id==""){
                alert("ID值为空");
            }else{
                $.ajax({
                    url:url,
                    methods:"GET",
                    dataType:"json",
                    data:{ id:id },
                    success:function(data){
                        if(data.result==0){
                            alert("删除成功");
                            list_imagedb(cate,'','');
                        }else{
                            alert(data.msg);
                        }
                    },
                    error:function(){
                        alert("啊哦,请求失败");
                    }
                })

            }
        }
    }
    function addimg(){//新增图片库图片
        var imgcate=$("#catetree").val();
        var uploadresult=$("#uploadresult").val();
        var imgname=$("#imgname").val();
        if(uploadresult==""){
            alert("请先上传图片！");
        }else if(imgname==""){
            alert("请输入图片名称！");
        }else if(imgcate==""){
            alert("请选择图片分类！");
        }else{
            var url=iyun_interface("imageDb")+"?do=addimgdb";
            $.ajax({
                url:url,
                methods:"GET",
                dataType:"json",
                data:{ folder:imgcate,imgname:imgname,imgurl:uploadresult },
                success:function(data){
                    //console.log(data)
                    if(data.result==0){
                        alert("添加成功");
                        $("#uploadresult").val("");
                        list_imagedb(imgcate,'','');
                    }else{
                        alert(data.msg);
                    }

                },
                error:function(){
                    alert("啊哦,请求失败");
                },
                beforeSend:function(){
                    $("#imagedb").html("<tr><td>正在努力获取图片列表......</td></tr>");
                }
            })
        }
    }
    function parentselect(){
        var imgcount=$("#allimgid li").length;
        var id='';
        var imgurl='';
        if(imgcount>0){
            $("#allimgid li").each(function(){
                id+=$(this).find("img").first().attr("id")+"|";
                imgurl+=$(this).find("img").first().attr("src")+"|";
            })
            //alert($("#allimgid").html())
        }else{
            alert("请选择图片");
            return false;
        }
        opener._callback_selectimg(id,imgurl);
        window.close();
    }
</script>
{footer}
